/*这样即可以滚动又可以隐藏滚动栏*/
html{
    height: 100%;
    width: 100%;
    overflow: hidden;
}
body{
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding-right: 17px;
}

.week-time-div{
    width: 100%;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-weight: bold;
}
.week-time-div #week-time{
    vertical-align: middle;
    color: white;
}

/*扩展到全屏查看课表。虽然是在lesson中加的，但是因为absolute的关系，这个按钮并不会滑动，所以好像就是在schedule中加的一样，哈哈哈*/
#expands{
    position: absolute;
    right: 0;
    top:0;
    width: 30px;
    height: 30px;
}

/*周次切换*/
#switch-week #before-week {
    position: absolute;
    left: 30%;
    top: 8px;
    width: 30px;
    height: 30px;
}

#switch-week #after-week {
    position: absolute;
    right: 30%;
    top:8px;
    width: 30px;
    height: 30px;
}

/*日期指示栏高度*/
.date-bar{
    width: 100%;
    height: 75px;
}

/*课程格子高度*/
.lesson-div{
    width: 100%;
    height: 200px;
}

/*详情frame*/
.lesson-root #lesson-detail{
    width: 100%;
    height: 675px;  /*800-75-30-10-10px 800是课程表整个高度 75是日期栏高度 30是周次显示高度 10是padding高度 后面那个10尼玛我也不知道为啥啊!!!*/
    border: 0;
}

.lesson-1,
.lesson-2,
.lesson-3,
.lesson-4,
.lesson-5{
    height: 100%;
}

.date-bar .date,
.lesson-div .lesson{
    /* width + 2 * margin = 12.5% */
    float: left;
    width: 11.5%;
    height:100%;
    margin: 0.5%;
    border-radius: 15px;
    text-align: center;
}

.lesson-div .lesson{
    background-color: transparent;
    color: white;
}

/*字行高需要分别设置*/
.date-bar .date{
    line-height: 75px;
}

/*课程格子行高*/
.lesson-div .lesson{
    line-height: 200px;
}
/*时间栏设置为透明*/
.lesson-div .lesson-time{
    color: black;
}

/*多行垂直居中*/
.date-bar .date span{
    display: inline-block;
    vertical-align: middle;
    line-height: 22px;
}
.lesson-div .lesson span{
    display: inline-block;
    vertical-align: middle;
    line-height: 22px;
}